<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<title>豆豆科技 - 客户合作</title>
		<link rel="stylesheet" href="./layui/css/layui.css">
		<link rel="stylesheet" href="./css/base.css">
		<link rel="stylesheet" href="./css/fullpage.css">
		<link rel="stylesheet" href="./css/swiper.min.css">
		<link rel="shortcut icon" type="image/x-icon" href="./img/favicon.ico"/>
	</head>

	<body>
		<!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
		<!--[if lt IE 9]>
		  <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
		  <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
		<![endif]-->
		<div class="layui-container">
			<div class="layui-row">
				<div class="layui-col-xs6">
					<div style="padding-left: 30%;">
						<img src="img/logo.png" height="60" />
					</div>
				</div>
				<div class="layui-col-xs6">
					<div class="grid-demo">
						<ul class="layui-nav">
							<li class="layui-nav-item">
								<a href="index.html">首页</a>
							</li>
							<li class="layui-nav-item">
								<a href="business.html">业务范围</a>
							</li>
							<li class="layui-nav-item">
								<a href="industry.html">行业资讯</a>
							</li>
							<li class="layui-nav-item">
								<a href="customer.html">客户合作</a>
							</li>
							<li class="layui-nav-item layui-this">
								<a href="javascript:;">关于我们</a>
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<div id="dowebok">
			<div class="section">
				<div class="layui-carousel" id="test">
					<div carousel-item="">
						<div><img src="img/about1.png" /></div>
					</div>
				</div>
				<div class="about-top">
					<div class="about-top-bg">
					</div>
					<div class="about-top-title">
						<p>关于我们</p>
						<p class="about-message-title-en">About us</p>
						<hr />
					</div>
					<div class="about-top-text">
						<div>
							<p class="about-top-text-title">豆豆缘起</p>
							<p>说起来，我们从事互联网信息产业也有十几个年头了。在一个行业呆久了，难免会混一个“砖家”的名头出来，当然，也会有很多朋友来请教关于这个行业的问题。几年前，朋友们问的最多的问题是：电子商务怎么做，网络营销怎么做。而现在，我们渐渐发现：朋友会抱怨一通在某某电商平台又赔本赚吆喝了。
							</p>
							<p>当越来越多的朋友来跟我们抱怨时，我们发现了一个很严重的问题，互联网与电子商务真的变天了，有一群已经“触网”的老朋友活的很辛苦，更有一大群“未触网”的新朋友茫然四顾，对此，作为一代互联网老兵，我们觉得应该做点什么了。
							</p>
							<p>就这样，一群终日奋斗在高大上项目里的青年“豺骏”终于下定了决心，逃离舒服到想死的大温床，准备撸起袖子大干一场。80后的我们，既爱卖萌耍酷、高谈人生、阔论梦想，又曾跌宕商场、几历沉浮、看淡炎凉，终以初具厚重的人生阅历和颇显岁月的沧桑面孔，聚起了一群初生牛犊不怕虎的90后，新的征途启程了，正如在深圳这片激情燃烧的创业沃土上破土而出的苗芽，顺手取一清新莞尔之名曰“豆豆”。
							</p>
							<p> 于是乎，深圳豆豆网络科技有限公司诞生了，当然，我们也同样钟爱“豆豆科技”这个雅号。
							</p>
						</div>
					</div>
				</div>
			</div>
			<div class="section about-message-bg">
				<div class="about-message">
					<div class="about-message-title">
						<p>CEO 寄语</p>
					</div>
					<div class="about-message-content">
						<div class="about-message-content-card">
							<div class="about-message-content-card-one">
								<div>
									<img src="img/about2.png" />
								</div>
								<div class="about-message-content-card-one-content">
									<div>
										<div>
											<p>杨敬业</p>
											<p>豆豆科技CEO</p>
											<p>前Google站长计划华南负责人</p>
											<p>易商联O2O综合服务平台创始人</p>
											<p>足淘网创始人</p>
										</div>
										<div>
											<p>杨敬业先生是中国最早一批接触互联网并投身该领域的资深互联网专家，</p>
											<p>在互联网平台运营、电子商务、O2O等领域具有丰富的项目运营经验。</p>
											<p>曾先后受邀参与中国供销总社、国家禁毒办公室、中国农产品交易网、中</p>
											<p>国PPP公私合作等相关平台架构与研发。</p>
											<p>杨敬业先生提出“在后互联网时代，互联网应该反向拥抱传统产业”。</p>
										</div>
									</div>
								</div>
							</div>
							<div style="margin: 10px 0 30px;">
								<p>（杨敬业先生与微软创始人比尔盖茨先生）</p>
							</div>
							<div class="about-message-content-card-two">
								<div>
									<p><img src="img/about3.png"></p>
									<p>杨敬业与中国财政学会副会长兼秘书长贾康先生</p>
								</div>
								<div>
									<p><img src="img/about4.png"></p>
									<p>杨敬业在海舶订货会接受媒体采访</p>
								</div>
								<div>
									<p><img src="img/about5.png"></p>
									<p>杨敬业在国际友好商务联盟启动大会发表演讲</p>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="section">
				<div class="about-active">
					<div class="about-active-title">
						<p>公司活动</p>
					</div>
					<div class="about-active-content">
						<div>
							<div><img src="img/about6.jpg" height="280" /></div>
							<div><img src="img/about7.jpg" height="280" /></div>
							<div><img src="img/about8.jpg" height="280" /></div>
							<div>
								<p>惠州巽寮湾之旅</p>
								<p class="about-active-content-time">2015.9</p>
								<hr/>
							</div>
						</div>
						<div class="alg-right">
							<div style="padding-right: 70px;text-align: left;">
								<p>清远团建</p>
								<p class="about-active-content-time">2016.9</p>
								<hr/>
							</div>
							<div><img src="img/about9.jpg" height="280" /></div>
							<div><img src="img/about10.jpg" height="280" /></div>
							<div><img src="img/about11.jpg" height="280" /></div>
						</div>
						<div>
							<div><img src="img/about12.jpg" height="280" /></div>
							<div>
								<p>厦门之旅</p>
								<p class="about-active-content-time">2017.9</p>
								<hr/>
							</div>
							<div style="float: right;"><img src="img/about13.jpg" height="280" /></div>
						</div>
						<div>
							<div><img src="img/about14.jpg" height="280" /></div>
							<div><img src="img/about15.jpg" height="280" /></div>
							<div>
								<p>广州白水寨之旅</p>
								<p class="about-active-content-time">2018.9</p>
								<hr/>
							</div>
						</div>
					</div>
				</div>
				<div class="about-us">
					<div class="about-us-title">
						<p>联系我们</p>
					</div>
					<div class="about-us-content">
						<div>
							<div>
								<p><img src="img/about16.png"></p>
								<p>深圳市宝安区留仙一路高新奇<br/>科技园一期B309</p>
								<p>ADD</p>
							</div>
							<div>
								<p><img src="img/about17.png"></p>
								<p>cyx@dodou.cn</p>
								<p>EMAIL</p>
							</div>
							<div>
								<p><img src="img/about18.png"></p>
								<p>0755-36958813</p>
								<p>TEL</p>
							</div>
						</div>
						<div>
							<img src="img/about19.png" />
						</div>
					</div>
				</div>
				<div class="footer">
					<div class="infoot">
						<p>Copyright © 2020
							<a href="http://beian.miit.gov.cn/publish/query/indexFirst.action" target="_blank" rel="noopener noreferrer">
								鄂ICP备00000000号 </a>
						</p>
					</div>
				</div>
			</div>
		</div>
		<script src="./layui/layui.all.js"></script>
		<script src="./js/jquery.min.js"></script>
		<script src="./js/swiper.min.js"></script>
		<script src="https://cdn.bootcss.com/fullPage.js/3.0.7/vendors/scrolloverflow.min.js"></script>
		<script src="./js/fullpage.js"></script>
		<script>
			//由于模块都一次性加载，因此不用执行 layui.use() 来加载对应模块，直接使用即可：
			;
			! function() {
				var layer = layui.layer,
					carousel = layui.carousel,
					form = layui.form;
				//图片轮播
				carousel.render({
					elem: '#test',
					width: '100%',
					arrow: 'hover',
					anim: 'fade'
				});
			}();
			$(function() {
				$('#dowebok').fullpage({
					sectionsColor: [],
					scrollOverflow: true,
					afterLoad: function(anchorLink, index) {
						if(index.index != 0) {
							$(".layui-container").css("width", "100%");
							$(".layui-container").css("background", "rgb(26,30,39)");
						} else {
							$(".layui-container").css("width", "100%");
							$(".layui-container").css("background", "transparent");
						}
						//						if(index.index == 2) {
						//							// 当页面滚动到倒数第一屏时，改变页面滚动方式
						//							$.fn.fullpage.setAutoScrolling(false);
						//							// 记录页面开始滚动的位置
						//							let start = $(document).scrollTop();
						//							let last = 0;
						//							$(document).scroll(function() {
						//								// 获得页面实时滚动的位置
						//								let end = $(document).scrollTop();
						//								// 如滚动的位置小于0，则代表页面在倒数第二屏向上滚，这个时候再改变页面的滚动方式
						//								if(end - start < 0) {
						//									$.fn.fullpage.setAutoScrolling(true);
						//								}
						//							})
						//
						//						}
					}
				});
			});
		</script>
		<style>
			.about-top {
				position: absolute;
				bottom: 0px;
				left: 50%;
				transform: translateX(-50%);
			}
			
			#test {
				height: 100% !important;
			}
			
			.about-top-title {
				color: #FFFFFF;
				font-size: 48px;
				font-weight: 600;
				margin-bottom: 90px;
			}
			
			.about-top-title .about-message-title-en {
				font-size: 26px;
				font-weight: 500;
				padding: 20px 0;
			}
			
			.about-top-title>hr {
				width: 40px;
				height: 2px;
				border-radius: 5px;
			}
			
			.about-top-text {
				width: 750px;
				background: #FFFFFF;
				padding: 50px 170px;
				line-height: 25px;
				margin-bottom: 50px;
			}
			
			.about-top-text p:not(:last-child) {
				margin-bottom: 30px;
			}
			
			.about-top-text-title {
				font-size: 25px;
				font-weight: 600;
				text-align: center;
				margin-bottom: 25px;
			}
			
			.layui-carousel>[carousel-item]>* {
				background: #FFFFFF;
			}
			
			.about-message-bg {
				background: #f5f5f5;
			}
			
			.about-message-title {
				font-size: 25px;
				font-weight: 600;
				width: 1200px;
				text-align: center;
				margin: 0 auto;
			}
			
			.about-message-content {
				padding-bottom: 50px;
			}
			
			.about-message-content-card {
				margin-top: 30px;
				margin-left: 28%;
				width: calc(1200px - (1200px * 28%));
			}
			
			.about-message-content-card-one {
				display: flex;
			}
			
			.about-message-content-card-one div {
				flex: 1;
				max-width: 480px;
				min-width: 480px;
			}
			
			.about-message-content-card-one div:first-child {
				margin-right: 30px;
			}
			
			.about-message-content-card-one-content {
				position: relative;
			}
			
			.about-message-content-card-one-content>div {
				position: absolute;
				bottom: 0;
				color: #333333;
			}
			
			.about-message-content-card-one-content>div>div:first-child {
				margin-bottom: 20px;
			}
			
			.about-message-content-card-one-content>div>div:first-child p {
				margin-bottom: 10px;
			}
			
			.about-message-content-card-one-content>div>div:first-child p:first-child {
				font-weight: 600;
				font-size: 20px;
				margin-bottom: 20px;
			}
			
			.about-message-content-card-one-content>div>div:last-child p {
				margin-bottom: 5px;
			}
			
			.about-message-content-card-one-content>div>div:last-child p:last-child {
				margin-bottom: 0px;
			}
			
			.about-message-content-card-two {
				margin-bottom: 100px;
			}
			
			.about-message-content-card-two>div {
				display: inline-block;
				margin-right: 30px;
			}
			
			.about-message-content-card-two>div>p {
				margin-top: 10px;
				text-align: center;
			}
			
			.about-active {
				width: 1200px;
				margin: 0 auto;
			}
			
			.about-active-title {
				font-size: 25px;
				font-weight: 700;
				text-align: center;
				padding: 30px;
			}
			
			.about-active-content>div {
				margin-bottom: 15px;
			}
			
			.about-active-content>div div {
				display: inline-block;
				margin-right: 15px;
				color: #666666;
				font-size: 23px;
				font-weight: 600;
				vertical-align: middle;
			}
			
			.about-active-content-time {
				font-weight: 500;
				font-size: 20px;
				padding: 10px 0;
			}
			
			.about-active-content>div div hr {
				height: 2px;
				width: 45px;
				background-color: #666666;
				border-radius: 5px;
			}
			
			.alg-right {
				text-align: right;
			}
			
			.about-us {
				background: #f5f5f5;
				margin-top: 70px;
			}
			
			.about-us-title {
				font-size: 25px;
				font-weight: 700;
				text-align: center;
				padding: 30px;
				width: 1200px;
				margin: 0 auto;
				padding-top: 40px;
			}
			
			.about-us-content {
				width: 1200px;
				margin: 0 auto;
				text-align: center;
				color: #333333;
			}
			
			.about-us-content>div:first-child {
				display: flex;
			}
			
			.about-us-content>div>div {
				flex: 1;
			}
			
			.about-us-content>div>div p {
				margin-bottom: 40px;
				position: relative;
				top: 20px;
			}
			
			.about-us-content>div>div p:first-child {
				margin-bottom: 20px;
			}
			
			.about-us-content>div>div p:last-child {
				font-weight: 600;
			}
			
			.about-us-content>div>div:first-child p:last-child {
				top: 0px;
				margin-bottom: 20px;
			}
			
			.about-us-content>div:last-child {
				padding-bottom: 295px;
			}
			
			* {
				font-family: "微软雅黑";
				-webkit-user-select: none;
				-moz-user-select: none;
				-ms-user-select: none;
				user-select: none;
			}
		</style>
	</body>

</html>